<template>
	<view class="safety storesTransfer">
		<view class="topHeaderBox between navBox" :style="{paddingTop: `${systemBarHeight+10}px`}">
			<image class="backIcon" src="https://wx.2024csnl.com/static/mine/back.png" @click="goBack(100)"></image>
			<view>代理登录</view>
			<view></view>
		</view>
		<view class="joinService">
			<image class="bgImg" src="https://wx.2024csnl.com/static/mine/buessBg.png"></image>
			<view class="msgBox">
				<view class="titleOne tit">欢迎登录</view>
				<view class="titleTwo tit">代理中心</view>
				<view class="oneInput flex">
					<image class="phoneIcon" src="https://wx.2024csnl.com/static/mine/phone.png"></image>
					<view class="line"></view>
					<input type="number" v-model="phone" placeholder="请输入手机号码" placeholder-style="color:#C1C1C1;" />
				</view>
				<view class="oneInput flex" style="position: relative;">
					<image class="phoneIcon" style="width: 28rpx;height: 30rpx;"
						src="https://wx.2024csnl.com/static/mine/password.png"></image>
					<view class="line"></view>
					<input :password="showPassword" v-model="password" placeholder="请输入密码"
						placeholder-style="color:#C1C1C1;" />

					<image class="eye" @click="showPassword=!showPassword"
						src="https://wx.2024csnl.com/static/mine/eyes.png"></image>
				</view>
				<view class="submitBtn flex" @click="onGoTable()">登录</view>
				<view class="agreement">登录即代表同意
					<text @click="onSkip(`/package/mine/agreement?pageType=平台用户协议`)">《用户协议》</text>
					<text @click="onSkip(`/package/mine/agreement?pageType=隐私政策`)">《隐私权政策》</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		setAgencyLogin
	} from "../../../api/index.js"
	export default {
		data() {
			return {
				showPassword: true,
				password: "",
				phone: '',
				//password: "",
				//phone: '',
				systemBarHeight: getApp().globalData.systemBarHeight,
			}
		},
		methods: {
			// 商家登录
			async onLogin() {
				const res = await setAgencyLogin(`s=/ApiZwyRequest/agentlogin`, {
					tel: this.phone,
					pwd: this.password
				})
				const {
					data,
					status,
					msg
				} = res.data
				console.log(res, "商家登录")
				this.showToast(msg)
				if (status == 1) {
					// uni.setStorageSync('merchant', bdata)
					setTimeout(() => {
						this.onSkip(`/package/mine/agencyDetails/agencyDetails?dmid=${data.dmid}`)
					}, 1500)

				}
			},
			//密码登录
			async onGoTable() {
				if (!/^1[3456789]\d{9}$/.test(this.phone)) {
					this.showToast('请输入正确手机号码')
				} else if (!this.password) {
					this.showToast('请输入密码')
				} else {
					// 登陆
					this.onLogin()
				}
			},
		}
	}
</script>

<style lang="scss" scoped>
	.agreement {
		text-align: center;
		color: #666;
		font-size: 26rpx;

		text {
			color: #F34242;
			margin: 0 10rpx;
		}
	}

	.submitBtn {
		margin: 79rpx 79rpx 48rpx 79rpx;
		color: #fff;
		font-size: 34rpx;
		background: #41644A;
		border-radius: 14rpx;
		padding: 20rpx 0;
		justify-content: center;
	}

	.eye {
		width: 33rpx;
		height: 23rpx;
		position: absolute;
		right: 45rpx;
	}

	input {
		height: 100%;
	}

	.storesTransfer {
		background: #F7F7F7;
		height: 100vh;
	}

	.msgBox {
		position: absolute;
		background: #F7F7F7;
		top: 0;
		width: 100vw;
		border-radius: 50rpx 50rpx 0 0;
		margin-top: 15vh;
		padding: 78rpx 0;


		.tit {
			color: #41644A;
			font-weight: 500;
			padding: 0 79rpx;
		}

		.titleOne {
			font-size: 65rpx;
		}

		.titleTwo {
			font-size: 47rpx;
			margin: 29rpx 0 70rpx;

		}
	}

	.oneInput {
		box-shadow: 0 13rpx 17rpx 0 rgba(235, 41, 47, 0.08);
		height: 95rpx;
		margin: 0 79rpx 43rpx 79rpx;
		border-radius: 10rpx;
		padding: 0 29rpx;
		background: #fff;
		align-items: center;

		.phoneIcon {
			height: 36rpx;
			width: 26rpx;
		}

		.line {
			width: 2rpx;
			margin: 0 31rpx 0 21rpx;
			height: 16rpx;
			background: #C1C1C1;
		}
	}

	.topHeaderBox {
		padding: 30rpx;
		position: fixed;
		left: 0;
		right: 0;
		top: 0;
		z-index: 99999;
		display: flex;
		background: rgb(230, 9, 63);

	}

	.navBox {
		font-size: 34rpx;
		font-weight: bold;
		color: #fff;
	}

	.backIcon {
		width: 21rpx;
		height: 37rpx;
	}

	.joinService {
		.bgImg {
			width: 100vw;
			height: 334rpx;
		}

	}
</style>